<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Using Lisk-JS</title>

    <!-- Latest compiled and minified CSS -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    <link href="https://gitcdn.github.io/bootstrap-toggle/2.2.2/css/bootstrap-toggle.min.css" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="css/style.css">
</head>
<body>

<nav class="navbar navbar-inverse navbar-fixed-top">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a class="navbar-brand" href="../index.html"><span><img width="25" height="25" src="lisk.png" alt="Lisk" /></span> lisk-js</a>
        </div>
        <div id="navbar" class="collapse navbar-collapse">
            <ul class="nav navbar-nav navbar-right">
                <li><a href="../index.html">HOME</a></li>
                <li class="active"><a href="api.html">API</a></li>
                <li><a href="experiment.html">EXPERIMENT</a></li>
            </ul>
        </div><!--/.nav-collapse -->
    </div>
</nav>

<div class="container">
    <div class="starter-template">
        <div class="rows">
            <!--
            <h1>API</h1>

            <p>The lisk-js package allows you to use the cryptography, several nodes or the API of Lisk.</p>
            -->
            <div class="col-md-2" id="listGroupNav" style="overflow-y:auto;">
                <div class="list-group custom-collapse" id="api_nav" style="overflow-y: scroll; position: fixed; left: 5%; top: 120px;width:300px!important;">
                    <a class="list-group-item" data-remote="true" href="#api_sub" data-toggle="collapse" data-parent="#api_sub">
                        <span>API</span>
                        <span class="menu-ico-collapse"><i class="fa fa-chevron-down"></i></span>
                    </a>

                    <div class="collapse list-group-submenu" id="api_sub">
                        <a href="#settings_sub" data-toggle="collapse" data-parent="#settings_sub" class="list-group-item sub-item"  style="padding-left: 24px;"><b>Settings</b></a>
                        <div class="collapse list-group-submenu" id="settings_sub">
                            <a href="#settings_example_1" class="list-group-item sub-item" data-parent="#settings_sub" style="padding-left: 34px;">Example 1 <small>random node</small></a>
                            <a href="#settings_example_2" class="list-group-item sub-item" data-parent="#settings_sub" style="padding-left: 34px;">Example 2 <small>localhost</small></a>
                        </div>

                        <a href="#api_functions_sub" data-toggle="collapse" class="list-group-item sub-item" data-parent="#api_functions_sub" style="padding-left: 24px;"><b>API Functions</b></a>
                        <div class="collapse list-group-submenu" id="api_functions_sub">
                            <a href="#functions_getAccount" class="list-group-item sub-item" data-parent="#api_functions_sub" style="padding-left: 34px;">getAccount</a>
                            <a href="#functions_listActiveDelegates" class="list-group-item sub-item" data-parent="#api_functions_sub" style="padding-left: 34px;">listActiveDelegates</a>
                            <a href="#functions_listStandbyDelegates" class="list-group-item sub-item" data-parent="#api_functions_sub" style="padding-left: 34px;">listStandbyDelegates</a>
                            <a href="#functions_searchDelegateByUsername" class="list-group-item sub-item" data-parent="#api_functions_sub" style="padding-left: 34px;">searchDelegateByUsername</a>
                            <a href="#functions_getBlock" class="list-group-item sub-item" data-parent="#api_functions_sub" style="padding-left: 34px;">getBlock</a>
                            <a href="#functions_listBlocks" class="list-group-item sub-item" data-parent="#api_functions_sub" style="padding-left: 34px;">listBlocks</a>
                            <a href="#functions_listForgedBlocks" class="list-group-item sub-item" data-parent="#api_functions_sub" style="padding-left: 34px;">listForgedBlocks</a>
                            <a href="#functions_getTransaction" class="list-group-item sub-item" data-parent="#api_functions_sub" style="padding-left: 34px;">getTransaction</a>
                            <a href="#functions_listTransactions" class="list-group-item sub-item" data-parent="#api_functions_sub" style="padding-left: 34px;">listTransactions</a>
                            <a href="#functions_listVotes" class="list-group-item sub-item" data-parent="#api_functions_sub" style="padding-left: 34px;">listVotes</a>
                            <a href="#functions_listVoters" class="list-group-item sub-item" data-parent="#api_functions_sub" style="padding-left: 34px;">listVoters</a>

                            <a href="#functions_listMultisignatureTransactions" class="list-group-item sub-item" data-parent="#api_functions_sub" style="padding-left: 34px;">listMultisignatureTransactions</a>
                            <a href="#functions_getMultisignatureTransaction" class="list-group-item sub-item" data-parent="#api_functions_sub" style="padding-left: 34px;">getMultisignatureTransaction</a>
                        </div>

                        <a href="#network_sub" data-toggle="collapse" class="list-group-item sub-item" data-parent="#api_sub" style="padding-left: 24px;"><b>Network Functions</b></a>
                        <div class="collapse list-group-submenu" id="network_sub">
                            <a href="#functions_sendRequest" class="list-group-item sub-item" data-parent="#network_sub" style="padding-left: 34px;">sendRequest</a>
                            <a href="#functions_getNetHash" class="list-group-item sub-item" data-parent="#network_sub" style="padding-left: 34px;">getNetHash</a>
                            <a href="#functions_setNode" class="list-group-item sub-item" data-parent="#network_sub" style="padding-left: 34px;">setNode</a>
                            <a href="#functions_listPeers" class="list-group-item sub-item" data-parent="#network_sub" style="padding-left: 34px;">listPeers</a>
                            <a href="#functions_setSSL" class="list-group-item sub-item" data-parent="#network_sub" style="padding-left: 34px;">setSSL</a>
                            <a href="#functions_setTestnet" class="list-group-item sub-item" data-parent="#network_sub" style="padding-left: 34px;">setTestnet</a>
                        </div>
                    </div>

                    <a class="list-group-item" data-remote="true" href="#crypto_sub" data-toggle="collapse" data-parent="#crypto_sub">
                        <span>Crypto</span>
                        <span class="menu-ico-collapse"><i class="fa fa-chevron-down"></i></span>
                    </a>

                    <div class="collapse list-group-submenu" id="crypto_sub">
                        <a class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 24px;"><b>Functions</b></a>
                        <a href="#functions_getKeys" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">getKeys</a>
                        <a href="#functions_getAddress" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">getAddress</a>
                        <a href="#functions_getBytes" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">getBytes</a>
                        <a href="#functions_getHash" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">getHash</a>
                        <a href="#functions_getId" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">getId</a>
                        <a href="#functions_getFee" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">getFee</a>
                        <a href="#functions_sign" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">sign</a>
                        <a href="#functions_secondSign" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">secondSign</a>
                        <a href="#functions_multiSign" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">multiSign</a>
                        <a href="#functions_getKeys" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">getKeys</a>
                        <a href="#functions_verify" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">verify</a>
                        <a href="#functions_verifySecondSignature" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">verifySecondSignature</a>
                        <a href="#functions_fixedPoint" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">fixedPoint</a>

                        <a href="#functions_bufferToHex" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">bufferToHex</a>
                        <a href="#functions_hexToBuffer" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">hexToBuffer</a>
                        <a href="#functions_useFirstEightBufferEntriesReversed" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">useFirstEightBufferEntriesReversed</a>
                        <a href="#functions_signMessageWithSecret" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">signMessageWithSecret</a>
                        <a href="#functions_printSignedMessage" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">printSignedMessage</a>
                        <a href="#functions_signAndPrintMessage" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">signAndPrintMessage</a>
                        <a href="#functions_verifyMessageWithPublicKey" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">verifyMessageWithPublicKey</a>

                        <a href="#functions_encryptMessageWithSecret" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">encryptMessageWithSecret</a>
                        <a href="#functions_decryptMessageWithSecret" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">decryptMessageWithSecret</a>

                        <a href="#functions_getPrivateAndPublicKeyFromSecret" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">getPrivateAndPublicKeyFromSecret</a>
                        <a href="#functions_getRawPrivateAndPublicKeyFromSecret" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">getRawPrivateAndPublicKeyFromSecret</a>
                        <a href="#functions_getAddressFromPublicKey" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">getAddressFromPublicKey</a>
                        <a href="#functions_getSha256Hash" class="list-group-item sub-item" data-parent="#crypto_sub" style="padding-left: 34px;">getSha256Hash</a>
                    </div>

                    <a class="list-group-item" data-remote="true" href="#transactions_sub" data-toggle="collapse" data-parent="#transactions_sub">
                        <span>Transactions</span>
                        <span class="menu-ico-collapse"><i class="fa fa-chevron-down"></i></span>
                    </a>

                    <div class="collapse list-group-submenu" id="transactions_sub">
                        <a class="list-group-item sub-item" data-parent="#transactions_sub" style="padding-left: 24px;"><b>Functions</b></a>
                        <a href="#functions_createTransaction" class="list-group-item sub-item" data-parent="#transactions_sub" style="padding-left: 34px;">Create Transaction</a>
                        <a href="#functions_createVote" class="list-group-item sub-item" data-parent="#transactions_sub" style="padding-left: 34px;">Create Vote</a>
                        <a href="#functions_createDapp" class="list-group-item sub-item" data-parent="#transactions_sub" style="padding-left: 34px;">Create Dapp</a>
                        <a href="#functions_createDelegate" class="list-group-item sub-item" data-parent="#transactions_sub" style="padding-left: 34px;">Create Delegate</a>
                        <a href="#functions_createSignature" class="list-group-item sub-item" data-parent="#transactions_sub" style="padding-left: 34px;">Create Second Signature</a>
                        <a href="#functions_createMultisignature" class="list-group-item sub-item" data-parent="#transactions_sub" style="padding-left: 34px;">Create Multisignature Account</a>
                        <a href="#functions_signMultisignature" class="list-group-item sub-item" data-parent="#transactions_sub" style="padding-left: 34px;">Sign Multisignature Transaction</a>
                    </div>
                </div>
            </div>
            <div class="col-md-10">
                <h2 id="api">API</h2>

                <h3 id="settings">Settings</h3>

                <p>Numerous settings are available when initialising the core API via Lisk-JS. Please see the examples below.</p>
                <p>The provision of settings is optional, therefore initialising without any arguments <code>var LSK = lisk.api();</code> yields the defaults.</p>

                <div class="panel panel-default" id="settings_example_1">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example 1 <small>Random node, testnet with port 7000</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var options = {
    ssl: false, // Default false. Set to true to enable the https instead of http protocol.
    node: '', // Default randomNode. Insert a node without http or https protocol. Use ssl option in order to set http or https.
    randomPeer: true, // Default true. Lisk-js automatically connects to a random peer to get lisk blockchain information. Set to false to disable this behaviour.
    testnet: true, // Default false. Set to true to use the testnet. Set to false to use the mainnet.
    port: '7000', // Default 8000. Enter the port as the protocol http(s)://node:port - can be any string.
    bannedPeers: [], // Default empty. Array of peers that should not be connected to. Without http(s) or port.
};

var LSK = lisk.api(options);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                            <div class="col-md-12" id="settings_example_2">
                                <h3>Example 2 <small>Restricted to localhost, port 8000, no SSL</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var options = {
    ssl: false, // default false
    node: 'localhost', // write node without http:// or port
    randomPeer: false, // default true
    testnet: false, // default false
    port: '8000', // default 8000
    bannedPeers: [], // default empty

};

var LSK = lisk.api(options);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h2 id="api_functions">API Functions</h2>

                <h3 id="functions_getAccount">getAccount</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Get single account by address</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
lisk.api().getAccount(accountAddress, callback);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_listActiveDelegates">listActiveDelegates</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Get the first 5 active delegates</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
lisk.api().listActiveDelegates(5, callback);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_listStandbyDelegates">listStandbyDelegates</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Get the first 6 standby delegates</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
lisk.api().listStandbyDelegates(6, callback);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_searchDelegateByUsername">searchDelegateByUsername</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Search for delegates by username</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
lisk.api().searchDelegateByUsername('username', callback);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_getBlock">getBlock</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Get a single block by id</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
lisk.api().getBlock(blockId, callback);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_listBlocks">listBlocks</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Get a list of blocks</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
lisk.api().listBlocks(amount, callback);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_listForgedBlocks">listForgedBlocks</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>List the forged blocks using a given public key</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
lisk.api().listForgedBlocks(publicKey, callback);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_getTransaction">getTransaction</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Get a single transaction by id</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
lisk.api().getTransaction(transactionId, callback);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_listTransactions">listTransactions</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>List transactions for a given address</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
lisk.api().listTransactions(address, limit, offset, callback);
                                        </code>
                                    </pre>
                                </figure>
                                <p><b>Address:</b> The Lisk address for recipient and sender of the transactions.</p>
                                <p><b>Limit:</b> The number of transactions to retrieve. Minimum: 1, Maximum: 1000.</p>
                                <p><b>Offset:</b> The number of records to offset the query from, e.g. a given offset of 10 excludes the first 10 records from the yielded results.</p>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_listVotes">listVotes</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>List votes placed by a given address</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
lisk.api().listVotes(address, callback);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_listVoters">listVoters</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>List votes received by a given address</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
lisk.api().listVoters(publicKey, callback);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_listMultisignatureTransactions">listMultisignatureTransactions</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Lists all pending multisignature transactions</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
lisk.api().listMultisignatureTransactions(callback);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_getMultisignatureTransaction">getMultisignatureTransaction</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Lists a multisignature transaction by a given transaction ID</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
lisk.api().getMultisignatureTransaction('transactionID', callback);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h2 id="network_functions">Network Functions</h2>

                <h3 id="functions_sendRequest">sendRequest</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <p><code>sendRequest</code> gives full access to the Lisk core API. It accepts any valid endpoint and parameters.</p>

                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>GET - Retreive the current block height</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">

var liskBlockheight = lisk.api().sendRequest('blocks/getHeight', function (data) {
    var str = JSON.stringify(data);
    document.getElementById('output').innerHTML = str;
});
                                        </code>
                                    </pre>
                                </figure>
                            </div>

                            <div class="col-md-12">
                                <h3>Example <small>POST - Open a new account</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var liskNewAccount = lisk.api().sendRequest('accounts/open', { secret: 'my secret passphrase' }, function (data) {
    var str = JSON.stringify(data);
    document.getElementById('output').innerHTML = str;
});
                                        </code>
                                    </pre>
                                </figure>
                                <p>The provided secret is intercepted and never transmitted over the network.<p>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_getNetHash">getNethash</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Get a unique hash for the currently selected network</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var LSK = lisk.api().getNethash();
                                        </code>
                                    </pre>
                                </figure>
                                Returning
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
{
    'Content-Type': 'application/json',
    'nethash': 'ed14889723f24ecc54871d058d98ce91ff2f973192075c0155ba2b7b70ad2511',
    'broadhash': 'ed14889723f24ecc54871d058d98ce91ff2f973192075c0155ba2b7b70ad2511',
    'os': 'lisk-js-api',
    'version': '1.0.0',
    'minVersion': '>=0.5.0',
    'port': this.port
}
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_setNode">setNode</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Set the currently selected node</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var LSK = lisk.api().setNode('mynode.com');
                                        </code>
                                    </pre>
                                </figure>
                                <p>Use <code>LSK.setNode();</code> without any arguments to automatically choose a new random node.</p>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_listPeers">listPeers</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Lists the peers configured for each network.</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var LSK = lisk.api().listPeers();
                                        </code>
                                    </pre>
                                </figure>
                                <p>Yields an object containing arrays of network categorised peers:</p>
                                <pre>
{
    official: [...],
    ssl: [...],
    testnet: [...],
    localhost: [...]

}
                                </pre>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_setSSL">setSSL</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Enable the SSL connecton protocol</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var LSK = lisk.api().setSSL(true); // or false
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_setTestnet">setTestnet</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Toggle between the testnet and mainnet</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var LSK = lisk.api().setTestnet(true); // or false
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h2 id="crypto">Crypto</h2>

                <h3 id="functions_getKeys">getKeys</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Get a public and private keypair from a given secret</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var keys = lisk.crypto.getKeys('secret');
                                        </code>
                                    </pre>
                                </figure>
                                Returning
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
{
    publicKey: '5d036a858ce89f844491762eb89e2bfbd50a4a0a0da658e4b2628b25b117ae09',
    privateKey: '2bb80d537b1da3e38bd30361aa855686bde0eacd7162fef6a2…44491762eb89e2bfbd50a4a0a0da658e4b2628b25b117ae09'
}
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_getAddress">getAddress</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Get the LSK address from a given public key</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var keys = lisk.crypto.getAddress('5d036a858ce89f844491762eb89e2bfbd50a4a0a0da658e4b2628b25b117ae09');
                                        </code>
                                    </pre>
                                </figure>
                                Returning
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
18160565574430594874L
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_getBytes">getBytes</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Get the number of bytes for a transaction object</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var transactionBytes = lisk.crypto.getBytes(transactionObject);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_getHash">getHash</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Get the hash of a transaction object</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var transactionHash = lisk.crypto.getHash(transactionObject);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_getId">getId</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Get the unique identifier of a transaction object</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var transactionId = lisk.crypto.getId(transactionObject);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_getFee">getFee</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Get the fees for a transaction object</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var transactionFee = lisk.crypto.getFee(transactionObject);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_sign">sign</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Sign a transaction object using a given keypair</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var transactionSignature = lisk.crypto.sign(transactionObject, keypair);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_secondSign">secondSign</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Add a second signature to a transaction object using a given keypair</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var transactionSignature = lisk.crypto.secondSign(transactionObject, keypair);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_multiSign">multiSign</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Add a multisignature to a transaction object using a given keypair</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var transactionSignature = lisk.crypto.multiSign(transactionObject, keypair);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_getKeys">getKeys</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Get a public and private keypair from a given secret</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var keypair = lisk.crypto.getKeys(secret);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_verify">verify</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Verify the signature of transaction object</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var verification = lisk.crypto.verify(transactionObject);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_verifySecondSignature">verifySecondSignature</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Verify the second signature of a transaction object</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var verification = lisk.crypto.verifySecondSignature(transactionObject);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_fixedPoint">fixedPoint</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Convert a given floating point LSK amount to an integer representation</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var bigAmount = lisk.crypto.fixedPoint(amount);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_bufferToHex">bufferToHex</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Convert a buffer to a hex string</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var hexString = lisk.crypto.bufferToHex(buffer);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_hexToBuffer">hexToBuffer</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Convert a hex string to buffer</small></h3>
                                <figure>
                                    <pre>
                                        <code class="language-html" data-lang="html">
var buffer = lisk.crypto.hexToBuffer(hexString);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_useFirstEightBufferEntriesReversed">useFirstEightBufferEntriesReversed</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Cut the first 8 bytes of a given buffer and reverses them</small></h3>
                                <p>Used to calculate unique identifiers.</p>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var rawId = lisk.crypto.useFirstEightBufferEntriesReversed(buffer);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_signMessageWithSecret">signMessageWithSecret</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Signs a message (<b>not encrypted</b>) using a plain message and a secret</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var messageSignature = lisk.crypto.signMessageWithSecret(message, secret);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_printSignedMessage">printSignedMessage</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Formats the given plain message, signed message and public key</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var printSignedMessage = lisk.crypto.printSignedMessage(message, signedMessage, publicKey);
                                        </code>
                                    </pre>
                                </figure>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
-----BEGIN LISK SIGNED MESSAGE-----
&lt;message&gt;
-----BEGIN SIGNATURE-----
&lt;publicKey&gt;
&lt;signature&gt;
-----END LISK SIGNED MESSAGE-----
                                        </code>
                                    </pre>
                                </figure>
                                <p>In order maintain formatting it is advised to wrap the resulting output within a <code>pre</code> tag.</p>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_signAndPrintMessage">signAndPrintMessage</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Signs a message (<b>not encrypted</b>) using a plain message and a secret, then prints it</small></h3>
                                <p>Combines the <a href="#functions_signMessageWithSecret">signMessageWithSecret</a> and <a href="#functions_printSignedMessage">printSignedMessage</a> functions.</p>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var printSignedMessage = lisk.crypto.printSignedMessage(message, secret);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_verifyMessageWithPublicKey">verifyMessageWithPublicKey</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Verify a signed message using a given public key</small></h3>
                                <p>Returns null if invalid, or the original message if valid.</p>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var verifySignedMessage = lisk.crypto.verifyMessageWithPublicKey(signedMessage, publicKey);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_encryptMessageWithSecret">encryptMessageWithSecret</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Encrypts a message with the given secret and recipient PublicKey</small></h3>
                                <p>Where message is a UTF-8 message, secret a passphrase and recipientPublicKey the publicKey in hex.</p>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var encrypted = lisk.crypto.encryptMessageWithSecret(message, secret, recipientPublicKey);
                                        </code>
                                    </pre>
                                </figure>
                                Returning
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
{
    encryptedMessage: encryptedMessage(hex),
    nonce: nonce(hex)
}
                                        </code>
                                    </pre>
                                </figure>
                                <p>Returns an object with the encrypted message and a nonce. Both are necessary in order to decrypt the message.</p>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_decryptMessageWithSecret">decryptMessageWithSecret</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Decrypts a message with secret, senderPublicKey and the nonce of the message</small></h3>
                                <p>Where encrypted message is the hex format of the encrypted message, nonce also hex. The secret as the passphrase of the recipient and the sender publicKey in hex.</p>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var encrypted = lisk.crypto.decryptMessageWithSecret(encryptedMessage, nonce, secret, senderPublicKey);
                                        </code>
                                    </pre>
                                </figure>
                                Returning
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
Original Message
                                        </code>
                                    </pre>
                                </figure>
                                <p>If successfull, returns the plain text of the senders message.</p>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_getPrivateAndPublicKeyFromSecret">getPrivateAndPublicKeyFromSecret</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Get a hex representation of a keypair from a given secret</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var keypair = lisk.crypto.getPrivateAndPublicKeyFromSecret(secret);
                                        </code>
                                    </pre>
                                </figure>
                                Returning
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
{
    publicKey: publicKey(hex),
    privateKey: privateKey(hex)
}
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_getRawPrivateAndPublicKeyFromSecret">getRawPrivateAndPublicKeyFromSecret</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Get a raw byte representation of a keypair from a given secret</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var keypairBytes = lisk.crypto.getRawPrivateAndPublicKeyFromSecret(secret);
                                        </code>
                                    </pre>
                                </figure>
                                Returning
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
{
    publicKey: publicKey(bytes),
    privateKey: privateKey(bytes)
}
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_getAddressFromPublicKey">getAddressFromPublicKey</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Get the address from a given public key</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var address = lisk.crypto.getAddressFromPublicKey(publicKeyHex);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_getSha256Hash">getSha256Hash</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Get the sha256 hash from a given string</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var sha256Hash = lisk.crypto.getSha256Hash(string);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h2 id="transactions">Transactions</h2>

                <h3 id="functions_createTransaction">Create Transaction</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Create a signed "balance transfer" transaction object</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var amount      = 1000 * Math.pow(10, 8); // 100000000000
var transaction = lisk.transaction.createTransaction('1859190791819301L', amount, 'passphrase', 'secondPassphrase');
                                        </code>
                                    </pre>
                                </figure>
                                Returning
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
{
    type: 0, // Transaction type. 0 = Normal transaction.
    amount: 100000000000, // The amount to send expressed as an integer value.
    asset: {}, // Transaction asset, dependent on tx type.
    fee: 100000000, // 0.1 LSK expressed as an integer value.
    id: '500224999259823996', // Transaction ID.
    recipientId: '1859190791819301L', // Recipient ID.
    senderPublicKey: '56e106a1d4a53dbe22cac52fefd8fc4123cfb4ee482f8f25a4fc72eb459b38a5', // Sender's public key.
    signSignature: '03fdd33bed30270b97e77ada44764cc8628f6ad3bbd84718571695262a5a18baa37bd76a62dd25bc21beacd61eaf2c63af0cf34edb0d191d225f4974cd3aa509', // Sender's second passphrase signature.
    signature: '9419ca3cf11ed2e3fa4c63bc9a4dc18b5001648e74522bc0f22bda46a188e462da4785e5c71a43cfc0486af08d447b9340ba8b93258c4c7f50798060fff2d709', // Transaction signature.
    timestamp: 27953413 // Based on UTC time of genesis since epoch.
}
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_createVote">Create Vote</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Create a signed "delegate vote" transaction object</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var transaction = lisk.vote.createVote('secret', ['+58199578191950019299181920120128129'], 'secondSecret');
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_createDapp">Create Dapp</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Create a signed "dapp registration" transaction object</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var options = {
    category: 0,
    name: 'Lisk Guestbook',
    description: 'The official Lisk guestbook',
    tags: 'guestbook message sidechain',
    type: 0,
    link: 'https://github.com/MaxKK/guestbookDapp/archive/master.zip',
    icon: 'https://raw.githubusercontent.com/MaxKK/guestbookDapp/master/icon.png'
};

var transaction = lisk.dapp.createDapp('secret', 'secondSecret', options);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_createDelegate">Create Delegate</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Create a signed "delegate registration" transaction object</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var transaction = lisk.delegate.createDelegate('secret', 'username', 'secondSecret');
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_createSignature">Create Second Signature</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Create a signed "second signature registration" transaction object</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var transaction = lisk.signature.createTransaction('secret', 'secondSecret');
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_createMultisignature">Create Multisignature Account</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Create a signed "multisignature account" transaction object</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var secret = 'myprivatesecret';
var secondSecret = '';
var keysgroup = ['+publicKey1', '+publicKey2']; // Add publicKeys for multisignature.
var lifetime = 20; // Time in hours until transactions will be invalid.
var min = 2; // Minimum signatures so that a transaction is valid.
var transaction = lisk.multisignature.createMultisignature(secret, secondSecret, keysgroup, lifetime, min);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>

                <h3 id="functions_signMultisignature">Sign Multisignature Transaction</h3>

                <div class="panel panel-default">
                    <div class="panel-body">
                        <div class="rows">
                            <div class="col-md-12">
                                <h3>Example <small>Sign a multisignature transaction object</small></h3>
                                <figure class="highlight">
                                    <pre>
                                        <code class="language-html" data-lang="html">
var signature = lisk.multisignature.signTransaction(transaction, secret);
                                        </code>
                                    </pre>
                                </figure>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- Latest compiled and minified JavaScript -->
<script src="https://code.jquery.com/jquery-3.1.1.min.js" integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
<script src="https://gitcdn.github.io/bootstrap-toggle/2.2.2/js/bootstrap-toggle.min.js"></script>
<script src="https://gitcdn.xyz/repo/LiskHQ/lisk-js/development/dist/lisk-js.js"></script>

<script>
'use strict';

$(window).on('resize', function () {
    var windowSize = $(window).width();

    if (windowSize < 1500) {
        $('#listGroupNav').hide();
    } else {
        $('#listGroupNav').show();
    }
});

$(document).ready(function () {
    var windowSize = $(window).width();

    if (windowSize < 1500) {
        $('#listGroupNav').hide();
    } else {
        $('#listGroupNav').show();
    }
});

$('.list-group-item').on('click', function () {
    var $this = $(this);

    $('.active').removeClass('active');
    $this.toggleClass('active');

    function getGroupHeight () {
        return +$('.list-group').height() + 150;
    }

    function getWindowHeight () {
        return $(window).height();
    }

    if (getGroupHeight() > getWindowHeight()) {
        $('#api_nav').css('height', (getWindowHeight() - 200));
        $('#listGroupNav').css('max-height', '150px');
        $('#listGroupNav').css('overflow-y', 'scroll');
    }

    setTimeout(function () {
        console.log(getGroupHeight());
        console.log(getWindowHeight());
    }, 500);
});
</script>

</body>
</html>
